<template>
	<view>
		<view class="cu-list menu card-menu margin-top sm-border">
			<view class="cu-item arrow clickC" @click="routeTo('/pages/service/detail')">
				<view class="content">
					<text class="cai-text-color cai-f-base">2021年7月23日</text>
				</view>
			</view>
			<view class="cu-item arrow clickC" @click="routeTo('/pages/service/detail')">
				<view class="content">
					<text class="cai-text-color cai-f-base">2021年7月22日</text>
				</view>
			</view>
		</view>
		
		<view class="cu-list menu card-menu margin-top sm-border">
			<view class="cu-item arrow clickC" @click="routeTo('/pages/service/detail')">
				<view class="content">
					<text class="cai-text-color cai-f-base">2021年6月30日</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import caiCustom from '@/components/cai-custom/index'
	export default {
		components: {
			caiCustom
		},
		data() {
			return {

			};
		},
		methods: {
			routeTo(url) {
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="scss">
.date{
	color: rgb(170, 170, 170);
	font-size: 28rpx;
	line-height: 36rpx;
	text-align: center;
	margin: 36rpx 0;
}
.page-msg{
	padding-bottom: 110rpx;
}
.msg-item{
	margin: 30rpx;
	overflow: hidden;
}
.msg-item-left{

}
.avatar{
	width: 76rpx;
	height: 76rpx;
	background-color: #fff;
	border-radius: 50%;
	float: left;
}
.info{
	float: left;
	width: 500rpx;
	margin: 0 16rpx;
	.name{
		color: rgb(170, 170, 170);
		font-size: 28rpx;
		line-height: 36rpx;
	}
	.msg{
		background-color: #fff;
		margin-top: 16rpx;
		padding: 24rpx;
		color: rgb(51, 51, 51);
		border-radius: 10rpx;
		display: inline-block;
		font-size: 28rpx;
	}
}
.msg-item-right{
	.info{
		float: right;
		text-align: right;
		.name{
			text-align: right;
		}
		.msg{
			text-align: left;
		}
	}
	.avatar{
		float: right;
	}
}
.input{
	position: fixed;
	
	/* #ifdef MP-WEIXIN */
	bottom: 20rpx;
	/* #endif */
	/* #ifdef H5 */
	bottom: 120rpx;
	/* #endif */
	
	left: 30rpx;
	background-color: #fff;
	width: 690rpx;
	border-radius: 50rpx;
	height: 96rpx;
	.input-wrap{
		position: relative;
		width: 100%;
		height: 100%;
	}
	input{
		// margin-top: 30rpx;
		height: 96rpx;
		width: 530rpx;
		padding-left: 32rpx;
	}
	.icon-img{
		position: absolute;
		right: 32rpx;
		top: 30rpx;
		width: 35rpx;
		height: 35rpx;
	}
}
</style>

<style lang="scss">
	
	.cu-list.menu>.cu-item{
		&:active{
			opacity: 0.7;
		}
	}
</style>